<!--
 * @Author: 梁青春
 * @Date: 2022-04-21 15:22:59
 * @LastEditTime: 2022-04-24 14:57:32
 * @LastEditors: 梁青春
-->
<template>
  <div>
    <el-row >
        <el-button>默认按钮</el-button>
        <el-button type="primary">主要按钮</el-button>
        <el-button type="success">成功按钮</el-button>
        <el-button type="info">信息按钮</el-button>
        <el-button type="warning">警告按钮</el-button>
        <el-button type="danger">危险按钮</el-button>
    </el-row>

    <el-row class="mt10">
        <el-button plain>朴素按钮</el-button>
        <el-button type="primary" plain>主要按钮</el-button>
        <el-button type="success" plain>成功按钮</el-button>
        <el-button type="info" plain>信息按钮</el-button>
        <el-button type="warning" plain>警告按钮</el-button>
        <el-button type="danger" plain>危险按钮</el-button>
    </el-row>

    <el-row class="mt10">
        <el-button round>圆角按钮</el-button>
        <el-button type="primary" round>主要按钮</el-button>
        <el-button type="success" round>成功按钮</el-button>
        <el-button type="info" round>信息按钮</el-button>
        <el-button type="warning" round>警告按钮</el-button>
        <el-button type="danger" round>危险按钮</el-button>
    </el-row>
</div>
    
<div>
    <div>
    <el-radio v-model="radio1" label="1">备选项1</el-radio>
    <el-radio v-model="radio1" label="2">备选项2</el-radio>
    </div>
    <div>
    <el-checkbox v-model="checked1" label="备选项1"></el-checkbox>
    <el-checkbox v-model="checked2" label="备选项2"></el-checkbox>
    </div>
</div>
<div>
    <div>
        <el-table style="width: 100%">
        <el-table-column prop="date" label="日期" width="180"></el-table-column>
        <el-table-column prop="name" label="姓名" width="180"></el-table-column>
        <el-table-column prop="address" label="地址"></el-table-column>
        </el-table>
    </div>

    <div class="mt10">
        <el-pagination layout="prev, pager, next" :total="1000"></el-pagination>

        <el-pagination background layout="prev, pager, next" :total="1000"></el-pagination>
    </div>
</div>
<div>
  <el-row :gutter="10">
    <el-col :span="12">
      <el-time-picker placeholder="任意时间点"></el-time-picker>
    </el-col>
    <el-col :span="12">
      <el-time-select
                      start="08:30"
                      step="00:15"
                      end="18:30"
                      placeholder="选择时间">
      </el-time-select>
    </el-col>
    <el-col :span="12">
      <el-date-picker type="date" placeholder="选择日期"></el-date-picker>
    </el-col>
    <el-col :span="12">
      <el-date-picker type="datetime" placeholder="选择日期时间">
      </el-date-picker>
    </el-col>
  </el-row>
</div>
<div>
  <div>
    <el-switch active-text="按月付费" inactive-text="按年付费"></el-switch>
  </div>
  <div class="mt10">
    <el-slider ></el-slider>
  </div>
</div>
</template>
